<!DOCTYPE html>
<html>
<head>
{include file="common/head"}
<style type="text/css">
.httag {
font-size: 18px;
height: 82px;
}
.right {
    float: right;
    font-size: 14px;
    color: #999;
}
.list-item {
    margin: 0;
    padding: 15px 15px;
    border-bottom: 1px dotted #e2e2e2;
}
.list-item:focus,.list-item:hover {
	background-color: #FAFAFA;
	
	
	box-shadow: 0 5px 10px rgba(0,0,0,.12);
    transform: translateY(-4px);
}
.layui-tab-content {
    padding: 0;
    padding-top: 10px;
}
img.avatar {
    width: 60px;
    height: 60px;
    border-radius: 8px;
    border: 1px solid #ddd;
    background-color: #fff;
	padding: 2px;
    margin: 10px 10px 10px 0;
}
.top-rank {
    float: left;
    
    line-height: 1.2;
    color: #666;
}
.top-rank .answers, .top-rank .views {
    display: inline-block;

}
.views p {

}
</style>
</head>

<body style="background-color: #f2f2f2;">
{include file="common/header"}

<div class="layui-container" style="margin-top: 80px;">
  <div class="layui-row layui-col-space15">
    <!--ls-->
    <div class="layui-col-md9">
	<div class="layui-card">
        <div class="layui-card-header httag">
		<div class="top-rank">
		<div class="answers"><img src="{if $topic.icon}{$topic.icon}{else}/image/topic/topics.jpg{/if}" class="avatar" alt="{$topic.name}"></div><div class="views"><p><i class="layui-icon {$topic.icon}"></i> {$topic.name}</p> <mdall><a href="{:url('wendasns/topic/follow')}" class="layui-btn layui-btn-xs layui-btn-danger J_req" data-json='{"id":"{$topic.id}"}' data-click="follow">{if $follow} 取消关注{else}<i class="layui-icon layui-icon-add-1"></i> 关注{/if}</a></mdall> </div></div>

		<span class="right">
		<span class="layui-hide-xs"><i class="fas fa-eye"></i> <i>{$topic.views}</i> 浏览 · </span>
		<span class="layui-hide-xs"><i class="fas fa-file-alt"></i> <i>{$count}</i> 内容 · </span>
		<span><i class="fas fa-user-check"></i> <i>{$topic.follow}</i> 关注</span>
		</span>
		
		</div>
        <div class="layui-card-body">
          {if $topic.intro}{$topic.intro}{else}这里是{$topic.name}话题的介绍{/if}
        </div>
      </div>
      <div class="layui-card">
      <div class="layui-card-body">
      <div class="layui-tab layui-tab-brief" style="margin-bottom: 0;">
          <ul class="layui-tab-title">
            <li{if $type eq 'question'} class="layui-this"{/if}><a href="{:url('wendasns/topic/show',['tags'=>$topic.name])}">问题</a></li>
            <li{if $type eq 'article'} class="layui-this"{/if}><a href="{:url('wendasns/topic/show',['tags'=>$topic.name,'type'=>'article'])}">文章</a></li>
          </ul>
          <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
          {volist name="logs" id="item" empty="<li>暂无数据</li>"}
          	<div class="list-item">
              {if $type eq 'question'}
              <div class="list-item-title"><h3><a href="{:url('wendasns/question/show',$item)}">{$item.title}</a></h3></div>
              <div class="" style="color: #999; font-size: 12px;"><i class="fas fa-eye"></i> {$item.visits} 阅读 · 
                <span>{:range_time($item.create_time)}</span> · 
                <a href="{:url('wendasns/home/index',['id'=>$item.user_id])}" link="">{$item.users.username}</a>
                <span style="float: right;">{$item.answer} 回答</span>
              </div>
              {else}
              	<div class="list-item-title"><a href="{:url('wendasns/article/show',$item)}">{$item.title}</a></div>
	              <div class="" style="color: #999; font-size: 12px;"><i class="fas fa-eye"></i> {$item.visits} 阅读 · 
	                <span>{:range_time($item.create_time)}</span> · 
	                <a href="{:url('wendasns/home/index',['id'=>$item.user_id])}" link="">{$item.users.username}</a>
	                <span style="float: right;">{$item.comment} 评论</span>
	              </div>
              {/if}
            </div>
            
            {/volist}
          <div class="pager">{$logs->render()|raw}</div>
          </div>
          </div>
      </div>
      </div>
      </div>
    </div>
    <!--le-->
    
    <!--rs-->
    <div class="layui-col-md3">
      {include file="common/right"}
    </div>
    <!--re-->
  </div>
</div>
{include file="common/footer"}
</body>
</html>
